<link rel=stylesheet href="__PUBLIC__/plugin/codemirror/codemirror.css">
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/codemirror.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/closetag.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/xml.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/javascript.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/css.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/htmlmixed.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/clike.js"></script>
<script type="text/javascript" src="__PUBLIC__/plugin/codemirror/php.js"></script>
<style type="text/css">
    .CodeMirror{
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    }
    .CodeMirror-code{
        line-height:20px;
    }
</style>
<script>
    var editor = CodeMirror.fromTextArea(document.getElementById("codeeditor"), {
        lineNumbers: true,
        mode: "application/x-httpd-php",
        indentUnit: 4,
        indentWithTabs: true,
        autoCloseTags: true
    });
</script>